<template>
    <div class="container">
        <el-cascader
          size="large"
          :options="options"
          v-model="selectedOptions"
          @change="addressChange">
        </el-cascader>
    </div>
</template>

<script>
  import {regionData, CodeToText, TextToCode} from 'element-china-area-data'
    export default {
        name: "selectpag",
      props:{
          addrs:{
            type:Array,
            default:()=>[]
          }
      },
      data(){
          let _this=this
          return {
            options: regionData,
            selectedOptions: []
          }
      },
      created() {
          this.getnews()
      },
      methods:{
        getnews(){
          this.selectedOptions=[
            TextToCode[this.addrs[0].province].code,
            TextToCode[this.addrs[0].province][this.addrs[0].city].code,
            TextToCode[this.addrs[0].province][this.addrs[0].city][this.addrs[0].county].code];
            let province=this.addrs[0].province;
            let city=this.addrs[0].city;
            let county=this.addrs[0].county;
            this.$emit('center' ,province,city,county)
        },
        addressChange(arr) {
          const province=CodeToText[arr[0]];//省
          const city=CodeToText[arr[1]];//市
          const county=CodeToText[arr[2]];// 区/县
          //console.log(CodeToText[arr[0]], CodeToText[arr[1]], CodeToText[arr[2]]);
          this.$emit('center' ,province,city,county)
        },
      }
    }
</script>

<style scoped lang="scss">

</style>
